<template>
  <div class="app-container">
    <h2>Demo2222</h2>
    <h2 v-if="showFlag==1">{{ stuName }}</h2>
    <h2 v-else v-html="colorStuName"></h2>
    <a v-bind:href="myUrl" target="_blank">百度</a>
    <div v-on:click="btnClickHandler">点我</div>
    <a :href="myUrl" target="_blank">163</a>
    <div @click="btnClickHandler">点我</div>
    <hr>
    <ul id="example-1">
    <li v-for="item in stuList" :key="item.sno">
      {{ item.sno }} | {{ item.sname }}
    </li>
  </ul>
  </div>
</template>

<script>
// import { listPost, getPost, delPost, addPost, updatePost } from "@/api/system/post";

export default {
  name: "Demo2",
  dicts: [],
  data() {
    return {
      stuName:'张三',
      colorStuName:'<span style="color:red">李红</span>',
      myUrl:"https://www.163.com",
      showFlag:2,
      stuList:[
        {sno:'1001',sname:'张三'},
        {sno:'1002',sname:'李三'},
        {sno:'1003',sname:'王三'},
      ]

    };
  },
  created() {
    
  },
  methods: {
   btnClickHandler(){
       if(this.showFlag==1)
        this.showFlag = 2
      else
        this.showFlag =1
   }
  }
};
</script>
